import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home'
import Index from '../views/Index'
import Account  from '../views/Account'
import Mydji from '../views/Mydji'
import Login from '../views/Login'
import Register from '../views/Register'
import Products from '../views/Products'
import Consumer from '../views/Consumer'
import Professional from '../views/Professional'

Vue.use(VueRouter)

const routes = [
  {
    path:'/',
    redirect: '/index',
    name:'Home',
    component:Home,
    children:[
      {
        path:'/index',
        name:'Index',
        component:Index
      },
      {
        path:'/products/:id',
        name:'Products',
        component:()=>import('../views/Products'),
      },
      {
        path:'/searchproducts/:name',
        name:'SearchProducts',
        component:()=>import('../views/SearchProducts'),
      }

    ]
  },
  {
    path:'/account',
    redirect:'/account/login',
    name:'Account',
    component:Account,
    children:[
      {
        path:'/account/register',
        name:'Register',
        component:()=>import('../views/Register'),
      },
      {
        path:'/account/login',
        name:'Login',
        component:()=>import('../views/Login'),
      },
    ]
  },
  {
    path:'/mydji',
    redirect:'mydji/information',
    name:'MyDJI',
    component:Mydji,
    children:[
      {
        path:'/mydji/information',
        name:'Information',
        component:()=>import('../views/Information')
      },
      {
        path:'/mydji/myorder',
        name:'MyOrder',
        component:()=>import('../views/MyOrder')
      },
      {
        path:'/mydji/address',
        name:'Address',
        component:()=>import('../views/Address')
      },
      
    ]
  },
  {
    path:'/cart',
    name:'Cart',
    component:()=>import('../views/Cart')
  },
  {
    path:'/myaddress',
    name:'MyAddress',
    component:()=>import('../views/MyAddress')
  },
  {
    path:'/order/:id',
    name:'Order',
    component:()=>import('../views/Order')
  }
 

  // {
  //   path:'/',
  //   name:'Index',
  //   component:Index
  // },
  // {
  //   path:'/',
  //   name:'Index',
  //   component:Index
  // },
  // {
  //   path:'/',
  //   name:'Index',
  //   component:Index
  // },

  // {
  //   path: '/',
  //   name: 'Home',
  //   component: Home
  // },
  // {
  //   path: '/about',
  //   name: 'About',
  //   // route level code-splitting
  //   // this generates a separate chunk (about.[hash].js) for this route
  //   // which is lazy-loaded when the route is visited.
  //   component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
  // }
]

const router = new VueRouter({
  routes
})

export default router
